<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>博客首页</title>
    <link rel="stylesheet" type="text/css" href="third-part/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="third-part/bootstrap/css/bootstrap-theme.min.css">
    <link rel="stylesheet" type="text/css" href="css/common.css"/>
    <link rel="stylesheet" type="text/css" href="css/main.css"/>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="third-part/bootstrap/js/bootstrap.min.js"></script>
</head>

<body>
<div class="top">
    <div class="topContainer">
        <div class="logoDiv">
            <img src="images/logo.png" id="blogImg" alt="Fiidee Blog"/>
        </div>
        <div class="navDiv">
            <ul>
                <li><a href="" class="actived">首页</a></li>
                <li><a href="">找人</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="menu">
    <div class="menuContainer row">
        <div class="searchBar col-md-3 col-sm-5">
            <div class="input-group ">
                <input type="text" name="search" class="form-control" placeholder="Search for Blog...">
	            <span class="input-group-btn">
	                <button class="btn btn-default search-btn" type="button">
                        <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                    </button>
	            </span>
            </div>
        </div>
        <div class="userinfoBar col-md-9 col-sm-7">
            <div class="usericon infoBar">
                <img src="images/post.png" alt=""/>
            </div>
            <div class="usericon infoBar">
                <img src="images/avatar.jpg" alt=""/>
            </div>
        </div>

    </div>
</div>
<div class="center">
    <div class="centerContainer row">
        <div class="leftContainer col-md-9 col-sm-12">
            <ul class="articalList">
                <li>
                    <div class="usericon articalicon"><img src="images/avatar.jpg" alt=""></div>
                    <div class="articalItem">
                        <div class="artcalSharp"></div>
                        <div class="acticalPopBox">
                            <div class="author">zzb</div>
                            <h1 class="articalTitle">Tech world 脑洞大开后来冷静思考</h1>
                            <div class="summaryBox">
                                <div class="thumb">
                                    <img src="http://a.hiphotos.baidu.com/news/crop%3D50%2C113%2C1151%2C691%3Bw%3D638/sign=8f7a6ab0cdfcc3cea08f9373af70e6a4/5fdf8db1cb134954c1490ef6534e9258d0094ac9.jpg" alt="">
                                </div>
                                <div class="summaryText">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    脑洞大开一般指，脑袋破了很大一个洞，用超强的想象力来填满，也就是形容人想象力非常丰富，以至于匪夷所思的地步。
                                    互联网时代一来，我们的脑袋就一再被洞穿，现在我们常常被人工智能、3D打印等未来科技激荡，甚至偶尔还会千疮百孔。在5月28日的Lenovo tech world，当联想董事长杨元庆遇到英特尔的CEO Brian Krzanic，微软CEO Satya Nadella和百度创始人李彦宏。脑洞再次大开，但实现可能会很残酷，我们到底要相信梦想，还是该面对现实呢？</div>
                            </div>
                            <a href="#" class="readMore">阅读更多内容-></a><br/>
                            <div class="popBottom row">
                                <div class="tags col-md-6">
                                    <span class="glyphicon glyphicon-tags" aria-hidden="true"></span>
                                    <a href="#" id="tag1">脑洞</a>
                                    <a href="#" id="tag2">人工智能</a>
                                </div>
                                <div class="hits col-md-6">
                                    <div class="hitsFloatRight">
                                        <a href="#" id="colArtical">收藏</a>
                                        <a href="#" id="hitCount">读度(140)</a>
                                        <a href="#" id="commentNum">评论(20)</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
            <div class="pagination"></div>
        </div>
        <div class="rightContainer col-md-3 col-sm-0">
            <div class="rightItem" id="categoryBox">
                <div class="title">文章分类</div>
                <ul class="rlist">
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                </ul>
            </div>
            <div class="rightItem" id="dateBox">
                <div class="title">文档分类</div>
                <ul class="rlist">
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                    <li><span class="listTitle">设计</span><span class="listRight listNum">(2)</span></li>
                </ul>
            </div>
            <div class="rightItem" id="userRecommendBox">
                <div class="title">推荐达人</div>
                <ul class="rlist">
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                </ul>
            </div>
            <div class="rightItem" id="articalRecommendBox">
                <div class="title">推荐博文</div>
                <ul class="rlist">
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                    <li><span class="listTitle">设计</span></li>
                </ul>
            </div>

        </div>
    </div>
</div>
<div class="bottom">
    <div class="bottomContainer">©Copyright 2015-FIIDEE</div>
</div>
</body>
</html>